*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
    /*去除双击选中文字*/
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}
textarea{
    outline: 0;
    resize: none;
}
input:focus{
    background-color: #D5F3F4;
}

body{
    display: flex;
    flex-direction: column;
    justify-content:flex-start;
    align-items: center;
}
header{
    position: relative;
    flex: 1;
    width: 100%;
    background-color: #F1EBE5;
}
section{
    background-color: #E0DCD4;
    width: 100%;
    flex: 10;
}
body>div{
    width: 100%;
    flex: 1;
}
header>div{
    position: absolute;
    bottom: 10px;
    width: 100%;
    height: 36px;

}
header div>div{
    float: left;
    height: 100%;
    margin: 0 10px;
}

header div div button,header div div>input{
    height: 100%;
}
header div div button{
    outline: none;
    width: 120px;
    border: 1px solid cadetblue;
    border-radius: 12px;
    font-size: 16px;
    background:linear-gradient(120deg,#FBFBEA,#D5F3F4,#D7FFF0);
    cursor: pointer;
}
header div div button:hover{
    text-shadow: 2px 2px 20px;
    box-shadow: -3px -3px 15px #fff ,3px 3px 15px #fff;
}
header div div button:active{
    box-shadow: -3px -3px 15px #f00,3px 3px 15px #f03;
}

header div::after{
    clear: both;
}


body>div>.opal-btn{
    width: 100%;
}